import React from "react";
//导入 useState 函数
import { useState } from "react";

export default function StateCom() {
  //声明
  let [count, setCount] = useState(100); 

  //声明 minus 函数
  let minus = () => {
    setCount(count - 1);
  };

  //声明 add 函数
  let add = () => {
    //该函数会在状态更新时调用, 并且会将当前的状态值作为参数传递给该函数
    //还会使用该函数的返回值, 作为状态的最新值
    setCount((v) => {
      return v + 1;
    });
  };

  //返回虚拟 DOM 对象
  return (
    <div>
      <h2>{count}</h2>
      <button onClick={add}>新增</button>
      <button onClick={minus}>减小</button>
    </div>
  );
}
